<script setup>
import {
  ref
} from 'vue'
import SettingDrawer from "./components/setting-drawer/index.vue"
import {GetMenuAjax} from "../../apis/api"

/**
 * 获取菜单列表
 */

const getMenuList = async () => {
  const result = await GetMenuAjax()
}
getMenuList()

/**
 * 菜单列表
 */
const menuList = ref([
  {
    icon: '/static/icon/wms/real.svg',
    name: '实时库存',
    route: '/pages/wms/warehouse-real/index'
  },
  {
    icon: '/static/icon/wms/inventory.svg',
    name: '仓库库存',
    route: '/pages/wms/warehouse-inventory/index'
  },
  {
    icon: '/static/icon/wms/balance.svg',
    name: '库存结存',
    route: '/pages/wms/warehouse-balance/index'
  },
  {
    icon: '/static/icon/wms/warehouse.svg',
    name: '仓库列表',
    route: '/pages/base-info/warehouse/index'
  },
  {
    icon: '/static/icon/wms/warehouse.svg',
    name: '仓位列表',
    route: '/pages/base-info/warehouse-position/index'
  },
  {
    icon: '/static/icon/wms/user.svg',
    name: '员工列表',
    route: '/pages/base-info/staff/index'
  }
])

/**
 * 设置弹窗实例
 */
const settingDrawerRef = ref()
const handleSetting = () => {
  settingDrawerRef.value.show()
}

/**
 * 跳转菜单
 */
const handleLink = (item) => {
  uni.navigateTo({
    url: item.route
  })
}
</script>

<template>
  <view class="page-wrap">
    <view class="page-header">
      <view class="header-user">
        <image class="user-image" src="/static/img/logo.jpg"></image>
        <view class="user-info">
          <view class="user-name">
            信达仓储管理员
          </view>
          <view class="user-role">
            <view class="user-role-logout">
              管理员
            </view>
          </view>
        </view>
        <image class="user-setting" src="/static/icon/icon-setting.svg" @click="handleSetting"></image>
      </view>
    </view>
    <view class="page-body">
      <view class="body-logout">
        <scroll-view scroll-y="true" style="height: 100%">
          <view class="menu-list">
            <view v-for="(item,index) in menuList" :key="index" class="menu-item" @click="handleLink(item)">
              <image :src="item.icon" class="menu-item-image"></image>
              <view class="menu-item-content">{{ item.name }}</view>
            </view>
          </view>
        </scroll-view>
      </view>
      <view class="body-version">
        当前版本：1.0.0
      </view>
    </view>

    <!-- 设置 -->
    <SettingDrawer ref="settingDrawerRef"/>
  </view>
</template>

<style scoped src="./index.scss">

</style>